﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Bootstrap 模板</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.2/style/weui.min.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.0/css/jquery-weui.min.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/Swiper/4.1.0/css/swiper.min.css">
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/find.css">
    <link rel="stylesheet" href="css/theme-color.css">
    <!--[if lt IE 9]>
    <script src="https://cdn.bootcss.com/html5shiv/3.7.0/html5shiv.min.js"></script>
    <script src="https://cdn.bootcss.com/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<header class="zyw-header">
    <div class="zyw-container white-color">
        <div class="head-l"><a href="javascript:window.history.back(-1)" target="_self"><img src="picture/head-return.svg" alt=""></a></div>
        <h1>发现好货</h1>
        <div class="head-r"></div>
    </div>
</header>
<footer class="zyw-footer">
    <div class="zyw-container white-bgcolor">
        <div class="weui-tabbar">
            <a href="index.html" class="weui-tabbar__item">
                <div class="weui-tabbar__icon">
                    <img src="picture/foot-1.svg" alt="">
                </div>
                <p class="weui-tabbar__label">首页</p>
            </a>
            <a href="class.html" class="weui-tabbar__item">
                <div class="weui-tabbar__icon">
                    <img src="picture/foot-2.svg" alt="">
                </div>
                <p class="weui-tabbar__label">分类</p>
            </a>
            <a href="find.html" class="weui-tabbar__item weui-bar__item--on">
                <div class="weui-tabbar__icon">
                    <img src="picture/foot-3-1.svg" alt="">
                </div>
                <p class="weui-tabbar__label">发现</p>
            </a>
            <a href="cart.html" class="weui-tabbar__item">
                <span class="weui-badge" style="position: absolute;top: -.4em;right: 1em;">8</span>
                <div class="weui-tabbar__icon">
                    <img src="picture/foot-4.svg" alt="">
                </div>
                <p class="weui-tabbar__label">购物车</p>
            </a>
            <a href="home.html" class="weui-tabbar__item">
                <div class="weui-tabbar__icon">
                    <img src="picture/foot-5.svg" alt="">
                </div>
                <p class="weui-tabbar__label">我的</p>
            </a>
        </div>
    </div>
</footer>
<section class="zyw-container">
    <div class="find-cart">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><a href="" class="cart-tab active">精选</a></div>
            <div class="swiper-slide"><a href="" class="cart-tab">直播</a></div>
            <div class="swiper-slide"><a href="" class="cart-tab">视频购</a></div>
            <div class="swiper-slide"><a href="" class="cart-tab">社区</a></div>
            <div class="swiper-slide"><a href="" class="cart-tab">家居生活</a></div>
            <div class="swiper-slide"><a href="" class="cart-tab">生鲜数码</a></div>
            <div class="swiper-slide"><a href="" class="cart-tab">个人洗护</a></div>
            <div class="swiper-slide"><a href="" class="cart-tab">海外直邮</a></div>
            <div class="swiper-slide"><a href="" class="cart-tab">服饰鞋靴</a></div>
        </div>
    </div>
    <div class="find-slider">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><img src="picture/tb2zg9raur1benjy0fmxxb0wvxa_!!2590951958.jpg" alt=""></div>
            <div class="swiper-slide"><img src="picture/tb2sxzvaqswbunjssrbxxa0mvxa_!!2590951958.jpg" alt=""></div>
            <div class="swiper-slide"><img src="picture/tb2vds4ax9ybunjy0ffxxxisvxa_!!2590951958.jpg" alt=""></div>
        </div>
        <!-- 如果需要分页器 -->
        <div class="swiper-pagination"></div>
    </div>
    <div class="find-group1">
        <div class="find-group1-item mb-625 white-bgcolor">
            <div class="group1-hd clearfix mb-625">
                <div class="pull-left hd-img"><img src="picture/user0.png" alt=""></div>
                <div class="pull-left">
                    <p class="hd-name">轻量科技</p>
                    <span class="hd-time">11月10日前</span>
                </div>
                <a href="" class="pull-right hd-take">+订阅</a>
            </div>
            <div class="group1-bd clearfix">
                <div class="pull-left bd-l">
                    <div class="bd-img"><img src="picture/5a73c80bnc4fab2ca.jpg!q90!cc_100x100.webp" alt=""></div>
                </div>
                <div class="pull-right bd-r">
                    <h4 class="bd-title">时尚女神节 抢5折优惠券转身变女神 你想要的这里都有</h4>
                    <span class="bd-intro">1.1万人浏览 2390件宝贝</span>
                </div>
            </div>
        </div>
        <div class="find-group1-item mb-625 white-bgcolor">
            <div class="group1-hd clearfix mb-625">
                <div class="pull-left hd-img"><img src="picture/user4.png" alt=""></div>
                <div class="pull-left">
                    <p class="hd-name">艾佳生活</p>
                    <span class="hd-time">10月10日发布</span>
                </div>
                <a href="" class="pull-right hd-take">+订阅</a>
            </div>
            <div class="group1-bd clearfix">
                <div class="pull-left bd-l">
                    <div class="bd-img"><img src="picture/5a6296c9nf984db1f.jpg" alt=""></div>
                </div>
                <div class="pull-right bd-r">
                    <h4 class="bd-title">
                        席梦思（Simmons） 原装进口独立袋弹簧 软硬适中 艾乔安娜承托 灰蓝白 1500*2000*280灰蓝白 1500*2000*280
                    </h4>
                    <span class="bd-intro">1.1万人浏览 2390件宝贝</span>
                </div>
            </div>
        </div>
        <div class="find-group1-item mb-625 white-bgcolor">
            <div class="group1-hd clearfix mb-625">
                <div class="pull-left hd-img"><img src="picture/user3.png" alt=""></div>
                <div class="pull-left">
                    <p class="hd-name">小虾米</p>
                    <span class="hd-time">10月10日发布</span>
                </div>
                <a href="" class="pull-right hd-take">+订阅</a>
            </div>
            <div class="group1-bd clearfix">
                <div class="pull-left bd-l">
                    <div class="bd-img"><img src="picture/58f4f7d7Nec86838c.jpg" alt=""></div>
                </div>
                <div class="pull-right bd-r">
                    <h4 class="bd-title">
                        ML权力的游戏史塔克家族徽章印花短袖T恤1700140 黑色AK权力的游戏史塔克家族徽章印花短袖T恤1700140 黑色 L
                    </h4>
                    <span class="bd-intro">1.1万人浏览 2390件宝贝</span>
                </div>
            </div>
        </div>
        <div class="find-group1-item mb-625 white-bgcolor">
            <div class="group1-hd clearfix mb-625">
                <div class="pull-left hd-img"><img src="picture/user2.png" alt=""></div>
                <div class="pull-left">
                    <p class="hd-name">每天都坚果一下</p>
                    <span class="hd-time">10月10日发布</span>
                </div>
                <a href="" class="pull-right hd-take">+订阅</a>
            </div>
            <div class="group1-bd clearfix">
                <div class="pull-left bd-l">
                    <div class="bd-img"><img src="picture/5a3a3de7nf6b6fe58.jpg" alt=""></div>
                </div>
                <div class="pull-right bd-r">
                    <h4 class="bd-title">
                        沃隆 每日坚果750g零食果干无添加混合坚果孕妇食品小包装礼盒 成人A款=25g*30袋
                    </h4>
                    <span class="bd-intro">1.1万人浏览 2390件宝贝</span>
                </div>
            </div>
        </div>
    </div>
</section>
<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/jquery-weui/1.2.0/js/jquery-weui.min.js"></script>
<script src="https://cdn.bootcss.com/Swiper/4.1.0/js/swiper.min.js"></script>
<script src="https://cdn.bootcss.com/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script>
    $(document).ready(function () {
        // 顶部分类滑动
        var swiper = new Swiper('.find-cart', {
            slidesPerView: 'auto',
            // centeredSlides: true,
            spaceBetween: 0,
            pagination: {
                el: '.swiper-pagination',
                clickable: true,
            },
        });
        // 顶部轮播图
        var mySwiper = new Swiper('.find-slider', {
            // 如果需要分页器
            autoplay: true,
            pagination: {
                el: '.swiper-pagination'
            }
        });
    })
</script>
</body>
</html>